<template>
    <div>
        <button @click="handleClick">{{open?'收起':'展开'}}</button>
        <BSlider :open="open">
            <div class="content">内容</div>
        </BSlider>
    </div>
</template>

<script setup lang="ts">
import { ref } from 'vue'

const open = ref(false)
const handleClick = () => {
    open.value = !open.value
}
</script>

<style lang='less' scoped>
.content{
    margin-top: 20px;
    height: 300px;
    background-color: antiquewhite;
}
</style>